<!DOCTYPE html>
<html>
<head>
	<title></title>
	
	<link rel="stylesheet" href="css/bootstrap.min.css">
	<link rel="stylesheet" href="css/bootstrap-theme.min.css">
	<link rel="stylesheet" type="text/css" href="css/custom.css">

	<!--Load jQuery-->
    <script type="text/javascript" src="js/jquery-1.11.0.js"></script>
</head>
<body>
    <!-- Modal -->
    <div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
        <div class="modal-content bukan-radius">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title warna"><span class="glyphicon glyphicon-user warna"></span>&nbsp &nbsp Login Administrator</h4>
        </div>
        <div class="modal-body">
          <form action="" method="post">
            <div class="form-group">
              <div class="input-group">
                <span class="input-group-addon warna warna-latar"><span class="glyphicon glyphicon-envelope"></span></span>
                <input type="text" class="form-control" placeholder="Username">
              </div>
              <br>
              <div class="input-group">
                <span class="input-group-addon warna warna-latar"><span class="glyphicon glyphicon-lock"></span></span>
                <input type="text" class="form-control" placeholder="*************">
              </div>
              <br>

            </div>
            <br>
          </form>
        </div><!-- End of Modal body -->
        </div><!-- End of Modal content -->
        </div><!-- End of Modal dialog -->
    </div><!-- End of Modal -->
<nav class="navbar navbar-defaul navbar-fixed-top warna-latar" role="navigation">
  <div class="container">
    <header>
      <div class="row">
        <div class="col-md-2">
          <a class="navbar-brand" href="index.html"><img src="img/logo.png" width="100%" height="40px"></a>
        </div>
        <div class="col-md-7"> 
          <div class="nav-container navbar">
            <ul class="nav nav-justified">
              <li class="active"><a href="index.html">Home</a></li>
              <li><a href="#">Tiket & Info</a></li>
              <li><a href="#">Gallery</a></li>
              <li><a href="about.html">About Us</a></li>
             
              <li>
                <a data-toggle="modal" data-target="#myModal" href="#">
                Administrator
                </a>
              </li>

            </ul>
          </div>
        </div>
        <div class="col-md-3">
          <div class="navbar-form">
          <div class="input-group">
            <input type="text" class="form-control" placeholder="Search">
            <span class="input-group-btn">
              <button class="btn btn-defaul" type="button"><span class="glyphicon glyphicon-search"></span></button>
            </span>
          </div><!-- /input-group -->
          </div>
        </div>
      </div>
    </header>
  </div>
</nav>
  <div class="container">
    <div class="jumbotron atas latar-jumbotron">
      <h2 class="san">Pemesanan Tiket</h2>
      <hr>
      <div class="row">
        <div class="col-md-4">
          <p>1. Rute Perjalanan</p>
          <form role="form">
            <div class="form-group">
              <label for="asal">Kota Asal :</label>
              <input type="text" class="form-control" id="asal" placeholder="Kota Asal">
            </div>
            <div class="form-group">
              <label for="tujuan">Kota Tujuan :</label>
              <input type="text" class="form-control" id="tujuan" placeholder="Kota Tujuan">
            </div>
          </form>
        </div>
        <div class="col-md-4">
          <p>2. Waktu Keberangkatan</p>
          <form role="form">
            <div class="form-group">
              <label for="tgl">Tanggal Berangkat :</label>
              <input type="date" class="form-control" id="tgl" placeholder="">
            </div>
          </form>
        </div>
        <div class="col-md-4">
          <p>3. Pilih Kelas</p>
          <div class="row">
            <div class="col-md-12">
              <form role="form">
                <div class="form-group">
                  <label for="kelas">Pilih Kelas : </label>
                  <select class="form-control"
                  id="kelas">
                    <option>VIP</option>
                    <option>Executive</option>
                    <option>Super Executive</option>
                  </select>
                </div>
              </form>
            </div>
          </div>
          <div class="row">
            <div class="col-md-6 col-md-offset-3">
              <button type="button" class="btn btn-oren btn-lg">Pesan</button>
            </div>
          </div>
        </div>
      </div>
    </div>

    

  </div>

  <div class="container-fluid">
    <div class="row">
      <div class="col-md-6">
        <div class="panel panel-default">
          <div class="panel-heading"><b>Mini Gallery</b></div>
          <div class="panel-body">
            <ul>
              <li><a href="#">Home</a></li>
              <li><a href="#">Cara Pemesanan</a></li>
              <li><a href="#">Tiket & Info</a></li>
              <li><a href="#">Gallery</a></li>
              <li><a href="#">About Us</a></li>
            </ul>
          </div>
        </div>
      </div>
      
      <div class="col-md-6">
        <div class="panel panel-default">
          <div class="panel-heading"><b>Contact Us</b></div>
          <div class="panel-body">
            <div class="row">
              <div class="col-md-3">
                e-mail
              </div>
              <div class="col-md-9">
                : Info@poharapanjaya.com (24 jam)
              </div>
            </div>
            <div class="row">
              <div class="col-md-3">
                SMS
              </div>
              <div class="col-md-9">
                : 081 2340 3355
              </div>
            </div>
            <div class="row">
              <div class="col-md-3">
                Handphone
              </div>
              <div class="col-md-9">
                : 081 3355 02250
              </div>
            </div>
            <div class="row">
              <div class="col-md-3">
                Alamat
              </div>
              <div class="col-md-9">
                : Jl.Mayor Sujadi 23 A T.Agung (0355)321620,321624,327575
              </div>
            </div>
            <div class="row">
              <div class="col-md-3">
                Fax
              </div>
              <div class="col-md-9">
                : (0355)322505
              </div>
            </div>
            <div class="row">
              <div class="col-md-3">
                Info Bus Malam
              </div>
              <div class="col-md-9">
                : (0355)323315, 327576 (08.00-19.00)
              </div>
            </div>

          </div>
        </div>
      </div>
    </div>

  <footer><p>&copy 2014 Harapan Jaya</p></footer>
  </div>
<!--Load Bootstrap JS ( Diletakan dibawah merupakan rekomendasi,agar proses load page lebih cepat )-->
    <script type="text/javascript" src="js/bootstrap.js"></script>

    <script type="text/javascript">
      $('document').ready(function(){

        $('#MyTooltip').tooltip();
        $('#myPopOver').popover();
        $('#myModal').modal('hide');

      });
      </script>
</body>
</html>